<template>
  <div>
    <FormPanel ref="formPanel" :list="formList" :cols="3" :labelWidth="80" formType="show" :isSubmitBtn="false" />
    <div class="custom-wrap">
      <LazyLoadTab v-model="activeName" :tabMenus="menus"></LazyLoadTab>
    </div>
    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right'
      }"
    >
      <el-button @click="closeDrawer">返 回</el-button>
    </div>
  </div>
</template>

<script>
import { dictionary } from '@/utils/dictMixin';
import { protectRepair, brandsdict, coudImplVin, saveVehicle } from '@/api/repair/business/customer/vehicleDetails';
import moment from 'moment';
export default {
  name: 'Vehicledetails',
  mixins: [dictionary],
  props: ['vehicleDetailsVin'],
  data() {
    this.dmsFunc = {};
    this.vehicleDetailsTotal = {};
    return {
      formList: this.createFormList(),
      activeName: '详细信息',
      menus: this.createMenus()
    };
  },
  mounted() {},
  created() {
    this.dmsFunc = { dmsFuncId: 35100010 };
    this.protectRepairFun(this.vehicleDetailsVin);
  },
  methods: {
    createMenus() {
      return [
        {
          title: '详细信息',
          path: 'repair/business/customer/ownerInfo/tabs/ownerInfo',
          params: {
            vin: this.vehicleDetailsVin
          },
          on: {
            formChangeHandle: val => {
              this.formChangeHandleMain(val);
            }
          }
        },
        {
          title: '车主备注',
          path: 'repair/business/customer/ownerInfo/tabs/ownerRemark',
          params: {
            protectRepairInfo: {}
          },
          on: {
            insuranceChangeHandle: val => {
              this.formChangeHandleMain(val);
            }
          }
        }
      ];
    },
    createFormList() {
      return [
        {
          type: 'SELECT',
          itemList: this.createDictList('1190'),
          label: '车主性质',
          fieldName: 'OWNER_PROPERTY'
        }
      ];
    },
    async protectRepairFun(val) {
      const res = await protectRepair(this.dmsFunc, val);
      this.menus.forEach(x => {
        x.params.protectRepairInfo = res;
      });
      this.vehicleDetailsTotal = res;
    },
    closeDrawer() {
      this.$emit('close', false);
    },
    formChangeHandleMain(val) {
      this.vehicleDetailsTotal = {
        ...this.vehicleDetailsTotal,
        ...val
      };
    }
  }
};
</script>

<style lang="less">
.custom-wrap {
  height: calc(100vh - 193px);
  // position: relative;
}
</style>
